<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title>个人中心</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
    <style>
      #header_top {
        background: #f23030;
      }
      #header_top .aui-title {
        color: #fff;
      }
      #app .aui-list-header {
        background: #eee;
      }
    </style>
</head>

<body>
    <header class="aui-bar aui-bar-nav" id="header_top">
        <a class="aui-pull-left aui-btn" onclick="goback()">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="aui-title">定位</div>
    </header>
    <div class="aui-content" id="app" v-cloak>
        <ul class="aui-list aui-list-in">
            <li class="aui-list-header">
                当前定位地址
            </li>
            <li class="aui-list-item aui-list-item-middle" @click="reback(oGps.name, oGps.coord, $event)">
                <div class="aui-list-item-inner">
                    {{oGps.name}} <span style="color: #f23030;" @click="relocation($event)">重新定位</span>
                  </div>
            </li>
        </ul>
        <ul class="aui-list aui-list-in">
            <li class="aui-list-header">
                附近地址
            </li>
            <li class="aui-list-item aui-list-item-middle" v-for="item in list" @click="reback(item.name, item.coord)">
                <div class="aui-list-item-inner aui-list-item-arrow">
                    {{item.name}}
                      </div>
            </li>
        </ul>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/aui-tab.js"></script>
<script type="text/javascript" src="../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../script/aui-pull-refresh.js"></script>
<script type="text/javascript" src="../../script/swiper.min.js"></script>
<script type="text/javascript" src="../../script/aui-slide.js"></script>
<script type="text/javascript">
    function goback() {
        api.closeWin()
    }
    var bMap = null
    apiready = function() {
        var header_top = $api.byId('header_top');
        var header_topPos = $api.offset(header_top);
        bMap = api.require('bMap');

        var app = new Vue({
          el: '#app',
          data: {
            address: '',
            list: [],
          },
          created: function() {
            var $_this = this;
            $_this.oGps = {
              name: api.pageParam.gps.address,
              coord: {
                lat: api.pageParam.gps.lat,
                lon: api.pageParam.gps.lon,
              }
            }
            $_this.list = api.pageParam.gps.poiList
          },
          methods: {
            reback: function (name, coord, ev) {
              var $_this = this;
              $api.setStorage('address', name)
              $api.setStorage('longitude', coord.lat)
              $api.setStorage('latitude', coord.lon)
              api.execScript({
                  name: 'root',
                  frameName: "two_frame/index.html",
                  script: 'window.location.reload()'
              })
              goback()
              return false
            },
            relocation: function (ev) {
              ev.stopPropagation()
              var $_this = this;
              bMap.getLocation({
                  autoStop: true,
                  filter: 1
              }, function(ret, err) {
                  if (ret.status) {
                      bMap.getNameFromCoords({
                          lon: ret.lon,
                          lat: ret.lat
                      }, function(ret, err) {
                          if (ret.status) {
                            $_this.address = ret.address
                            $_this.list = ret.poiList
                            $_this.oGps = {
                              name: ret.address,
                              coord: {
                                lat: ret.lat,
                                lon: ret.lon,
                              }
                            }
                            $api.setStorage('province', ret.province)
                            $api.setStorage('city', ret.city)
                            $api.setStorage('longitude', ret.lon)
                            $api.setStorage('latitude', ret.lat)
                            $api.setStorage('address', ret.address)
                          }
                      });
                  } else {
                      api.toast({
                          msg: '获取定位信息失败',
                          duration: 2000,
                          location: 'middle'
                      });
                      gps = false
                      $('#header_top .aui-pull-left span').text('定位失败')
                  }
              });

            }
          }
        })

    };
</script>

</html>
